<!DOCTYPE html>
<html>
 <head></head> 
 <body class="hold-transition skin-blue sidebar-mini">  
  <meta charset="utf-8" /> 
  <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
  <title>AdminLTE 2 | Icons</title> 
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport" /> 
  <link rel="stylesheet" href="css/bootstrap.min.css" /> 
  <link rel="stylesheet" href="css/font-awesome.min.css" /> 
  <link rel="stylesheet" href="css/ionicons.min.css" /> 
  <link rel="stylesheet" href="css/AdminLTE.min.css" /> 
  <link rel="stylesheet" href="css/skins/_all-skins.min.css" /> 
  <link rel="stylesheet" href="css/dataTables.bootstrap.min.css" /> 
  <link rel="stylesheet" href="css/style.css" /> 
  <div class="wrapper"> 
   <header class="main-header"> 
    <a href="index2.html" class="logo"> <span class="logo-mini"> <b>A</b>LT</span> <span class="logo-lg"> <b>AdminLTE</b> </span> </a> 
    <nav class="navbar navbar-static-top"> 
     <a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button"> <span class="sr-only">Toggle navigation</span></a> 
     <div class="navbar-custom-menu"> 
      <ul class="nav navbar-nav"> 
       <li> <a href="#" id="log-out"> <i class="fa fa-mail-reply"></i>退出登录</a> </li> 
      </ul> 
     </div> 
    </nav> 
   </header> 
   <aside class="main-sidebar"> 
    <section class="sidebar"> 
     <ul class="sidebar-menu" data-widget="tree"> 
      <li> <a href="/index.html"> <i class="fa fa-home"></i> <span>首页</span></a> </li> 
      <li class="treeview"> <a href="#"> <i class="fa fa-th"></i> <span>投诉建议</span> <span class="pull-right-container"> <i class="fa fa-angle-left pull-right"></i> </span> </a> 
       <ul class="treeview-menu"> 
        <li> <a href="/tsjy.html"> <i class="fa fa-circle-o"></i>投诉建议</a> </li> 
       </ul> </li> 
     </ul> 
    </section> 
   </aside> 
   <div class="content-wrapper"> 
    <section class="content-header"> 
     <h1>设备组管理</h1> 
     <ol class="breadcrumb"> 
      <li> <a href="#"> <i class="fa fa-dashboard"></i>首页</a> </li> 
      <li class="active">当前</li>
     </ol> 
    </section> 
    <section class="content"> 
     <div class="box box-info"> 
      <div class="box-header with-border"> 
       <h3 class="box-title">筛选用户</h3>
      </div> 
      <form class="form-horizontal"> 
       <div class="box-body"> 
        <div class="col-sm-4 form-group"> 
         <label class="col-sm-4 control-label width-auto">设备类型</label> 
         <div class="col-sm-8"> 
          <select name="" class="form-control"></select> 
         </div> 
        </div> 
        <div class="col-sm-4 form-group"> 
         <label class="col-sm-4 control-label width-auto">SN</label> 
         <div class="col-sm-8"> 
          <input type="text" class="form-control" /> 
         </div> 
        </div> 
        <div class="col-sm-4 form-group"> 
         <label class="col-sm-4 control-label width-auto">设备组名称</label> 
         <div class="col-sm-8"> 
          <select name="" class="form-control"></select> 
         </div> 
        </div> 
        <button type="button" class="btn btn-primary"> <i class="fa fa-search"></i>查询</button> 
       </div> 
      </form> 
     </div> 
     <div class="box"> 
      <div class="box-header"> 
       <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal"> <i class="fa fa-pencil-square-o"></i>新增</button> 
       <button type="button" class="btn btn-primary"> <i class="fa fa-sort-amount-desc"></i>导入</button> 
       <button type="button" class="btn btn-info" data-toggle="modal" data-target="#order">订购套餐</button> 
       <button type="button" class="btn btn-info" data-toggle="modal" data-target="#type">修改状态</button> 
       <button type="button" class="btn btn-info" data-toggle="modal" data-target="#equipment">修改设备组</button> 
       <button type="button" class="btn btn-info" data-toggle="modal" data-target="#switch">ADB开关</button> 
       <button type="button" class="btn btn-primary pull-right"> <i class="fa fa-file-excel-o"></i>导出Excel</button> 
      </div> 
      <div class="box-body"> 
       <div id="example2_wrapper" class="dataTables_wrapper form-inline dt-bootstrap"> 
        <div class="row"> 
         <div class="col-sm-6"></div> 
         <div class="col-sm-6"></div> 
        </div> 
        <div class="row"> 
         <div class="col-sm-12"> 
          <table class="table table-bordered table-hover dataTable"> 
           <thead> 
            <tr role="row"> 
             <th><input type="checkbox" /></th> 
             <th>SN</th> 
             <th>设备登入名</th> 
             <th>设备类型</th> 
             <th>设备组</th> 
             <th>设备激活时间</th> 
             <th>今日流量</th> 
             <th>状态</th> 
             <th>操作</th> 
            </tr> 
           </thead> 
           <tbody> 
            <tr role="row" class="odd"> 
             <td><input type="checkbox"></td> 
             <td>865832021263041</td> 
             <td>启用</td> 
             <td>Gecko</td> 
             <td>Gecko</td> 
             <td>Seamonkey 1.1</td> 
             <td>启用</td> 
             <td><span class="text-green">正常</span> </td> 
             <td> <button type="button" data-toggle="modal" data-target="#myModal" class="btn btn-success btn-xs"> <i class="fa fa-wrench"></i>编辑</button> <button type="button" data-toggle="modal" data-target="#order" class="btn btn-info btn-xs"> <i class="fa fa-shopping-cart"></i>订购</button> <button type="button" data-toggle="modal" data-target="#purchase" class="btn btn-warning btn-xs"> <i class="fa fa-shopping-cart"></i>已购</button> </td> 
            </tr> 
            <tr role="row" class="even"> 
             <td><input type="checkbox"></td> 
             <td>865832021263041</td> 
             <td>启用</td> 
             <td>Gecko</td> 
             <td>Gecko</td> 
             <td>Seamonkey 1.1</td> 
             <td>启用</td> 
             <td><span class="text-red">异常</span> </td> 
             <td> <button type="button" data-toggle="modal" data-target="#myModal" class="btn btn-success btn-xs"> <i class="fa fa-wrench"></i>编辑</button> <button type="button" class="btn btn-danger btn-xs"> <i class="fa fa-trash-o"></i>删除</button> </td> 
            </tr> 
           </tbody>
          </table> 
         </div> 
        </div> 
        <div class="row"> 
         <div class="col-sm-5"> 
          <div class="dataTables_info" id="example2_info" role="status" aria-live="polite">
           Showing 1 to 10 of 57 entries
          </div>
         </div> 
         <div class="col-sm-7"> 
          <div class="dataTables_paginate paging_simple_numbers" id="example2_paginate"> 
           <ul class="pagination"> 
            <li class="paginate_button previous disabled" id="example2_previous"> <a href="#" aria-controls="example2" data-dt-idx="0" tabindex="0">Previous</a></li> 
            <li class="paginate_button active"> <a href="#" aria-controls="example2" data-dt-idx="1" tabindex="0">1</a></li> 
            <li class="paginate_button "> <a href="#" aria-controls="example2" data-dt-idx="2" tabindex="0">2</a></li> 
            <li class="paginate_button "> <a href="#" aria-controls="example2" data-dt-idx="3" tabindex="0">3</a></li> 
            <li class="paginate_button "> <a href="#" aria-controls="example2" data-dt-idx="4" tabindex="0">4</a></li> 
            <li class="paginate_button "> <a href="#" aria-controls="example2" data-dt-idx="5" tabindex="0">5</a></li> 
            <li class="paginate_button "> <a href="#" aria-controls="example2" data-dt-idx="6" tabindex="0">6</a></li> 
            <li class="paginate_button next" id="example2_next"> <a href="#" aria-controls="example2" data-dt-idx="7" tabindex="0">Next</a></li> 
           </ul> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
      <!-- /.box-body -->
     </div> 
    </section> 
   </div> 
   <div class="control-sidebar-bg"></div> 
  </div> 
  <!-- ADB开关弹窗 --> 
  <div class="modal fade" id="switch"> 
   <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">批量修改开发模式 </h4>
     </div> 
     <div class="row"> 
      <form class="col-md-12 form-horizontal"> 
       <div class="modal-body  col-sm-12"> 
      <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">ADB(开发模式) </label> 
        <div class="col-sm-9"> 
          <select name="" class="form-control">
            <option value="">开</option>
            <option value="">关</option>
          </select>
        </div> 
       </div>
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> 
         <button type="submit" class="btn btn-primary">确定</button>
        </div>  
       </div> 
      </form>
     </div> 
    </div> 
   </div> 
  </div>   <!-- 修改设备组弹窗 --> 
  <div class="modal fade" id="equipment"> 
   <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">修改设备组 </h4>
     </div> 
     <div class="row"> 
      <form class="col-md-12 form-horizontal"> 
       <div class="modal-body  col-sm-12"> 
      <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">设备组名称 </label> 
        <div class="col-sm-9"> 
          <select name="" class="form-control">
          </select>
        </div> 
       </div>
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> 
         <button type="submit" class="btn btn-primary">确定</button>
        </div>  
       </div> 
      </form>
     </div> 
    </div> 
   </div> 
  </div> 
  <!-- 状态弹窗 --> 
  <div class="modal fade" id="type"> 
   <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">修改状态 </h4>
     </div> 
     <div class="row"> 
      <form class="col-md-12 form-horizontal"> 
       <div class="modal-body  col-sm-12"> 
      <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">状态</label> 
        <div class="col-sm-9"> 
          <select name="" class="form-control">
            <option value="">开</option>
            <option value="">关</option>
          </select>
        </div> 
       </div>
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> 
         <button type="submit" class="btn btn-primary">确定</button>
        </div>  
       </div> 
      </form>
     </div> 
    </div> 
   </div> 
  </div> 
  <!-- 已购弹窗 --> 
  <div class="modal fade" id="purchase"> 
   <div class="modal-dialog" style="width: 1000px;"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">订购套餐:<span class="text-light-blue pull-right mr-20">865832021263041</span></h4>
     </div> 
     <div class="row"> 
      <form class="col-md-12 form-horizontal"> 
       <div class="modal-body  col-sm-12"> 
        <div class="form-group m0"> 
         <div class="col-sm-4 form-group"> 
          <label class="col-sm-4 control-label width-auto">套餐名称</label> 
          <div class="col-sm-8"> 
           <input class="form-control" /> 
          </div> 
         </div> 
         <button type="button" class="btn btn-primary">搜索</button> 
         <div class="form-group m0"> 
          <table class="table table-bordered table-hover dataTable"> 
           <thead> 
            <tr role="row"> 
             <th>状态</th> 
             <th>套餐名称</th> 
             <th>周期结束时间</th> 
             <th>有效期</th> 
             <th>流量</th> 
             <th>订购时间</th> 
             <th>操作</th> 
            </tr> 
           </thead> 
           <tbody> 
            <tr role="row" class="odd"> 
             <td><span class="text-green">已启动</span></td> 
             <td>Seamonkey 1.1</td> 
             <td>启用</td> 
             <td><input type="checkbox" /></td> 
             <td><input type="text" class="form-control w120" placeholder="请输入日期" /></td> 
             <td><input type="number" class="form-control w120" placeholder="请输入数量" /></td> 
             <td> <button type="button" class="btn btn-danger btn-xs"> <i class="fa fa-trash-o"></i>删除</button> </td> 
            </tr> 
            <tr role="row" class="even"> 
             <td><span class="text-yellow">未启动</span></td> 
             <td>Gecko</td> 
             <td>Seamonkey 1.1</td> 
             <td><input type="checkbox" /></td> 
             <td><input type="text" class="form-control w120" placeholder="请输入日期" /></td> 
             <td><input type="number" class="form-control w120" placeholder="请输入数量" /></td> 
             <td> <button type="button" class="btn btn-danger btn-xs"> <i class="fa fa-trash-o"></i>删除</button> </td> 
            </tr> 
            <tr role="row" class="odd"> 
             <td><span class="text-muted">已过期</span></td> 
             <td>Seamonkey 1.1</td> 
             <td>启用</td> 
             <td><input type="checkbox" /></td> 
             <td><input type="text" class="form-control w120" placeholder="请输入日期" /></td> 
             <td><input type="number" class="form-control w120" placeholder="请输入数量" /></td> 
             <td> <button type="button" class="btn btn-danger btn-xs"> <i class="fa fa-trash-o"></i>删除</button> </td> 
            </tr> 
           </tbody>
          </table> 
         </div> 
        </div> 
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> 
         <button type="submit" class="btn btn-primary">确定</button>
        </div>  
       </div> 
      </form>
     </div> 
    </div> 
   </div> 
  </div> 
  <!-- 订购弹窗 --> 
  <div class="modal fade" id="order"> 
   <div class="modal-dialog" style="width: 1000px;"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">订购套餐</h4>
     </div>  
     <div class="modal-body col-sm-12"> 
      <div class="form-group m0"> 
       <div class="col-sm-4 form-group"> 
        <label class="col-sm-4 control-label width-auto">套餐名称</label> 
        <div class="col-sm-8"> 
         <input class="form-control" /> 
        </div> 
       </div> 
       <button type="button" class="btn btn-primary">搜索</button> 
       <div class="form-group m0"> 
        <table class="table table-bordered table-hover dataTable"> 
         <thead> 
          <tr role="row"> 
           <th>序号</th> 
           <th>套餐名称</th> 
           <th>周期(天)</th> 
           <th>总流量(MB)</th> 
           <th>费用</th> 
           <th>叠加</th> 
           <th>生效时间</th> 
           <th>数量</th> 
           <th>操作</th> 
          </tr> 
         </thead> 
         <tbody> 
          <tr role="row" class="odd"> 
           <td>1</td> 
           <td>Seamonkey 1.1</td> 
           <td>启用</td> 
           <td>Gecko</td> 
           <td>Seamonkey 1.1</td> 
           <td><input type="checkbox" /></td> 
           <td><input type="text" class="form-control w120" placeholder="请输入日期" /></td> 
           <td><input type="number" class="form-control w120" placeholder="请输入数量" /></td> 
           <td> <button type="button" class="btn btn-success btn-xs"> <i class="fa fa-shopping-cart"></i>购买</button> </td> 
          </tr> 
          <tr role="row" class="even"> 
           <td>2</td> 
           <td>Seamonkey 1.1</td> 
           <td>启用</td> 
           <td>Gecko</td> 
           <td>Seamonkey 1.1</td> 
           <td><input type="checkbox" /></td> 
           <td><input type="text" class="form-control w120" placeholder="请输入日期" /></td> 
           <td><input type="number" class="form-control w120" placeholder="请输入数量" /></td> 
           <td> <button type="button" class="btn btn-success btn-xs"> <i class="fa fa-shopping-cart"></i>购买</button> </td> 
          </tr> 
         </tbody>
        </table> 
       </div> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> 
       <button type="submit" class="btn btn-primary">添加</button>
      </div>  
     </div> 
    </div> 
   </div> 
  </div> 
  <!-- 新增编辑弹窗 --> 
  <div class="modal fade" id="myModal"> 
   <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">添加设备</h4>
     </div> 
      <div class="modal-body row"> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">设备序列号</label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">设备类型 </label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">版本</label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">设备出厂批次</label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">主控模块号码</label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">启动卡IMEI</label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">启动卡IMSI</label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">Wifi密码</label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">设备登入名 </label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">设备登入密码 </label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">网络类型 </label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">状态 </label> 
        <div class="col-sm-9"> 
         <input type="text" class="form-control" />
        </div> 
       </div> 
       <div class="form-group col-sm-12"> 
        <label class="col-sm-3 control-label">备注</label> 
        <div class="col-sm-9"> 
         <textarea type="text" class="form-control"></textarea>
        </div> 
       </div> 
      <div class="modal-footer"> 
       <div class="col-sm-12"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> 
        <button type="submit" class="btn btn-primary">添加</button>
       </div> 
      </div>  
     </div> 
    </div> 
   </div> 
  </div> 
  <script src="js/jquery.min.js"></script> 
  <script src="js/bootstrap.min.js"></script>  
 </body>
</html>